<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>随即抽奖</title>
</head>
<style>
    body {
        background-image: url("./JS案例需要的素材/年会抽奖图片.png");
    }
    div{
        width: 300px;
        height: 200px;
        /*background-color: #007bff;*/
        position: absolute;
        top: 200px;
        left: 300px;
    }
</style>
<body>
<div>
<h1>一等奖:<span id="span1"></span></h1>
<h2>二等奖:<span id="span2"></span></h2>
<h3>三等奖:<span id="span3"></span></h3>
</div>
<script>
    var arr=["张三","李四","王五","小明","小王"]

    //获取一等奖的元素
    var elementById = document.getElementById("span1");

    //生成随机数
    var random1 = Math.floor(Math.random()*arr.length);
    //把随机数当作数组下标，以此生成随即人名，把人名加入
   elementById.innerHTML= arr[random1];
   //删除已经获奖的人
    arr.splice(random1,1)//删除元素：从数组 arr 的索引 random 位置开始删除 1 个元素

    //获取2等奖的元素
    var elementById = document.getElementById("span2");

    //生成随机数
    var random2 = Math.floor(Math.random()*arr.length);
    //把随机数当作数组下标，以此生成随即人名，把人名加入
    elementById.innerHTML= arr[random2];
    //删除已经获奖的人
    arr.splice(random2,1)//删除元素：从数组 arr 的索引 random 位置开始删除 1 个元素

    //获取3等奖的元素
    var elementById = document.getElementById("span3");

    //生成随机数
    var random3 = Math.floor(Math.random()*arr.length);
    //把随机数当作数组下标，以此生成随即人名，把人名加入
    elementById.innerHTML= arr[random3];
    //删除已经获奖的人
    arr.splice(random3,1)//删除元素：从数组 arr 的索引 random 位置开始删除 1 个元素
</script>
</body>
</html>